<!--<template>-->
<!--  <el-dialog-->
<!--    title="修改用户"-->
<!--    :visible.sync="isModifyShow"-->
<!--    width="50%"-->
<!--    :before-close="handleClose"-->
<!--  >-->
<!--    <el-form label-width="100px">-->
<!--      <el-row :gutter="20">-->
<!--        <el-col :lg="24" :xl="24">-->
<!--          <el-form-item label="名称">-->
<!--            <el-input-->
<!--              type="text"-->
<!--              v-model="queryParam.name"-->
<!--              placeholder="请输入名称"-->
<!--            ></el-input>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :lg="24" :xl="24">-->
<!--          <el-form-item label="关联角色">-->
<!--            <el-select-->
<!--              v-model="queryParam.roleId"-->
<!--              multiple-->
<!--              placeholder="请选择关联角色"-->
<!--              style="width:100%"-->
<!--            >-->
<!--              <el-option-->
<!--                clearable-->
<!--                v-for="(item, index) in roleList"-->
<!--                :key="index"-->
<!--                :label="item.label"-->
<!--                :value="item.value"-->
<!--              >-->
<!--              </el-option>-->
<!--            </el-select>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->
<!--    </el-form>-->
<!--    <span slot="footer" class="dialog-footer">-->
<!--      <el-button @click="handleClose">取 消</el-button>-->
<!--      <el-button type="primary" @click="sureBtn">确 定</el-button>-->
<!--    </span>-->
<!--  </el-dialog>-->
<!--</template>-->

<!--<script>-->
<!--import serve from "@/api/jurisdiction";-->

<!--export default {-->
<!--  data() {-->
<!--    return {-->
<!--      queryParam: {-->
<!--        name: "",-->
<!--        roleId: [],-->
<!--        id: ""-->
<!--      }-->
<!--    };-->
<!--  },-->
<!--  props: {-->
<!--    isModifyShow: {-->
<!--      type: Boolean,-->
<!--      default() {-->
<!--        return false;-->
<!--      }-->
<!--    },-->
<!--    roleList: {-->
<!--      type: Array,-->
<!--      default() {-->
<!--        return [];-->
<!--      }-->
<!--    },-->
<!--    id: {-->
<!--      type: String,-->
<!--      default() {-->
<!--        return "";-->
<!--      }-->
<!--    },-->
<!--    name: {-->
<!--      type: String,-->
<!--      default() {-->
<!--        return "";-->
<!--      }-->
<!--    }-->
<!--  },-->
<!--  watch: {-->
<!--    // eslint-disable-next-line-->
<!--    isModifyShow(val) {-->
<!--      this.queryParam.id = this.id;-->
<!--      this.queryParam.name = this.name;-->
<!--      this.getList();-->
<!--    }-->
<!--  },-->
<!--  created() {},-->
<!--  methods: {-->
<!--    handleClose() {-->
<!--      this.$emit("closeModel", false);-->
<!--    },-->
<!--    getList() {-->
<!--      serve.accountSelectRoleServe({ accountId: this.id }).then(res => {-->
<!--        if (res.code === 200) {-->
<!--          this.queryParam.roleId = res.data.map(item => {-->
<!--            return item.roleId;-->
<!--          });-->
<!--        } else {-->
<!--          this.$message.error(res.errorMsg, 2);-->
<!--        }-->
<!--      });-->
<!--    },-->
<!--    sureBtn() {-->
<!--      if (this.queryParam.name === "") {-->
<!--        this.$message.error("请输入名称");-->
<!--        return;-->
<!--      }-->
<!--      if (this.queryParam.roleId.length === 0) {-->
<!--        this.$message.error("请选择关联角色");-->
<!--        return;-->
<!--      }-->
<!--      this.queryParam.roleId = this.queryParam.roleId.join(",");-->
<!--      serve.update(this.queryParam).then(res => {-->
<!--        if (res.code === 200) {-->
<!--          this.$message.success(res.errorMsg, 2);-->
<!--          this.handleClose();-->
<!--        } else {-->
<!--          this.$message.error(res.errorMsg, 2);-->
<!--        }-->
<!--      });-->
<!--    }-->
<!--  }-->
<!--};-->
<!--</script>-->

<!--<style scoped></style>-->
<template>
  <el-dialog
    title="修改用户"
    :visible.sync="isModifyShow"
    width="50%"
    :before-close="handleClose"
  >
    <el-form label-width="100px">
      <el-row :gutter="20">
        <el-col :lg="24" :xl="24">
          <el-form-item label="名称">
            <el-input
              type="text"
              v-model="queryParam.userName"
              placeholder="请输入名称"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :lg="24" :xl="24">
          <el-form-item label="手机号">
            <el-input
              maxlength="11"
              type="text"
              v-model="queryParam.mobile"
              placeholder="请输入手机号"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :lg="24" :xl="24">
          <el-form-item label="关联角色">
            <el-select
              v-model="queryParam.roleId"
              placeholder="请选择关联角色"
              style="width:100%"
            >
              <el-option
                clearable
                v-for="(item, index) in roleList"
                :key="index"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button class="normal-btn" @click="handleClose">取 消</el-button>
      <el-button type="warning" @click="sureBtn">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import serve from "@/api/jurisdiction";

export default {
  data() {
    return {
      queryParam: {
        userName: "",
        roleId: "",
        userAccount: "",
        companyId: "",
        mobile: ""
      }
    };
  },
  props: {
    isModifyShow: {
      type: Boolean,
      default() {
        return false;
      }
    },
    roleList: {
      type: Array,
      default() {
        return [];
      }
    },
    account: {
      type: String,
      default() {
        return "";
      }
    },
    userName: {
      type: String,
      default() {
        return "";
      }
    },
    mobile: {
      type: String,
      default() {
        return "";
      }
    },
    companyId: {
      type: [String, Number],
      default() {
        return "";
      }
    },
    roleId: {
      type: [String, Number],
      default() {
        return "";
      }
    }
  },
  watch: {
    isModifyShow() {
      this.queryParam.userAccount = this.account;
      this.queryParam.roleId = this.roleId;
      this.queryParam.userName = this.userName;
      this.queryParam.mobile = this.mobile;
      this.queryParam.companyId = this.companyId;
    }
  },
  created() {},
  methods: {
    handleClose() {
      this.$emit("closeModel", false);
    },
    sureBtn() {
      if (this.queryParam.userName === "") {
        this.$notify.error("请输入名称");
        return;
      }
      if (this.queryParam.mobile === 0) {
        this.$notify.error("请输入手机号");
        return;
      }
      if (this.queryParam.roleId === "") {
        this.$notify.error("请选择关联角色");
        return;
      }
      serve.update(this.queryParam).then(res => {
        if (res.code === 200) {
          this.$notify.success("操作成功", 2);
          this.handleClose();
        } else {
          this.$notify.error(res.message, 2);
        }
      });
    }
  }
};
</script>

<style scoped></style>
